<template>
  <div class="jkolp">
      <div class="aderlistssto">
          <div class="hhh">
              <div class="biao">
                  <div class="left it">
                      <span class="iconfont icon-xiangzuo" @click="guopulu"></span>
                  </div>
                  <div class="cen it">
                     <span>我的地址</span>
                  </div>
                  <div class="right it">
                      <span class="iconfont "></span>
                  </div>
              </div>
          </div>
          <div class="adlist">
                <div class="ad">
                    <van-address-list
                        v-model="chosenAddressId"
                        :list="list"
                        disabled-text=""
                        @add="onAdd"
                        @edit="onEdit"
                        @select="select"
                    />
                </div>
          </div>
      </div>
  </div>
</template>

<script>
import Vue from 'vue';
import { AddressList } from 'vant';
Vue.use(AddressList);
export default {
    data(){
        return {
            chosenAddressId: '1',
            list:[
                {
                id: '1',
                name: '张三',
                tel: '13000000000',
                address: '广东省广州市天河区00街道00号',
                },
                {
                id: '2',
                name: '李四',
                tel: '1310000000',
                address: '广东省广州市00区00街道00号',
                },
            ],
            disabledList: [
                {
                id: '3',
                name: '王五',
                tel: '1320000000',
                address: '浙江省杭州市滨江区江南大道 15 号',
                },
            ],
            indexid:null,
        }
    },
    methods:{
        onAdd(){
            // console.log("123")
            // this.$router.push('/addfrom')
            this.$router.push('/addersto');
        },
        onEdit(item,index){
            // let dataitem=item;
            // let indexto = index;
            console.log(item,index);
            this.indexid=index;
            console.log('',this.indexid)
            let data={
                name:item.name,
                id:item.id,
                addressDetail:item.address,
                tel:item.tel,
            }
            this.$router.push({name:'addedlit',params:{obj:data,index:this.indexid}})
        },
       
        select(item,index){
            console.log("sel",index,item);
            let addressto = item;
            window.sessionStorage.setItem('addressto',JSON.stringify(addressto));//存数据
            // let nm = JSON.parse(sessionStorage.getItem('addressto'));//取数据
            // console.log(nm)
            // this.$router.push('/order');
        },
        guopulu(){
            this.$router.push('/order');
        },
        getpudazhi(){
            let lisgoasd = JSON.parse(sessionStorage.getItem('addresslist'));//取数据
            if(lisgoasd){
                this.list=lisgoasd;
            }else{
                window.sessionStorage.setItem('addresslist',JSON.stringify(this.list));//存数据
            }
        }
       
    },
    created(){
        this.getpudazhi();
        // this.getaddto()
        // if(this.$route.params.obj){
        //     //  console.log(this.$route.params.obj);
        //     //   console.log(this.$route.params.index);
        //     //  this.indexid=this.$route.params.index;
        //     //  this.edit(this.$route.params.obj)
        // }
       
    }   
}
</script>

<style lang="less">
    .jkolp{
        width: 100%;
        height: 100%;
        position: absolute;
        background-color: rgb(250, 249, 249);
    }
    .aderlistssto{
        width: 100%;
        height: 100%;
        // position: relative;
        // background-color: #fff;
        z-index: 90px;
        .hhh{
            width: 100%;
            height: 40px;
            background-color: #fff;
            .biao{
                width: 100%;
                height: 40px;
                position: fixed;
                top: 0;
                left: 0;
                background-color: #fff;
                color: #000;
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding-left: 10px;
                z-index: 90;
                padding-right: 10px;
                box-sizing: border-box;
                .it{
                    width: 10%;
                    height: 100%;
                    display: flex;
                    align-items: center;
                   
                }
                .cen{
                    width: 20%;
                }
                .left{
                    text-align: center;
                    span{
                        &.iconfont{
                            font-size: 20px;
                        }
                    }
                }
            }
        }
        .adlist{
            width: 100%;
            // height: 100%;
            padding-left: 10px;
            padding-right: 10px;
            // margin-top: 10px;
            // z-index: 90;
            background-color: rgb(250, 249, 249);
            box-sizing: border-box;
            .ad{
                width: 100%;
                
               .van-address-list{
                //    .van-radio-group{
                //        .van-address-item{}
                //    }
                   .van-address-list__bottom{
                       border: 1px solid white;
                   }
               }
            }
        }
    }
</style>